<template>
  <!-- 渠道建设项目维护 -->
  <div>
    <!-- 搜索 -->
    <TopFilter
      :list="topFilterInit"
      :cols="3"
      labelWidth="100"
      @filterChange="changeHandle"
      @onCollapse="collapseHandle"
      ></TopFilter>
     <!-- table -->
    <FilterTable
        ref="table"
        :columns="columns"
        :fetchapi="fetchApi"
        :isSelectColumn="isSelectColumn"
        :params="fetchParams"
        :datakey="'records'"
        columnsRef='origin_baseSetting_construction_index_01'
        :onColumnsChange="columns => this.columns = columns">
      <template slot="controls" >
       <el-button size="small" type="primary" icon="el-icon-plus" @click="dialogHandle('','add')">新增</el-button>
      </template>
   </FilterTable>
    <BaseDialog title="渠道建设项目维护" :visible.sync="visible"
      width="400px"
      destroyOnClose
      :containerStyle="{height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px'}" >
      <addDialog  v-model="initData" ref='addDialog' @close="dialogClose" />
    </BaseDialog>
  </div>
</template>
<script>
import addDialog from './addDialog'
import { dictionary } from '@/utils/dictMixin';
import { searchConstruction } from '@/api/cms-api/origin/baseSetting/construction';
import {  formatdateByTime } from '@/utils';
import { getAppId } from '@/assets/js/auth';//获取登录用户
import { isArcfox } from '@/api/cms-api/origin/commonDealerType';		//渠道类型工具类
export default {
  name:'construction',
  components: {
    addDialog
  },
  mixins: [dictionary],
  data() {
    return {
      visible:false,
      isSelectColumn:false,
      infoId:null,
      topFilterInit:this.topFilterInitFun(),
      fetchParams:{},  //参数
      initData: {},
      columns:this.creatHeader(),
      fetchApi: searchConstruction,
      dealerTypeRemove:[] //渠道类型排除内容
    };
  },
  mounted() {
    this.BaseTable = this.$refs.table.$refs.pageTable;
  },
  created() {
    //初始化页面中的渠道类型
    this.initType();

  },
  methods: {
      //初始化页面中的渠道类型
      initType(){
        //判断品牌，如果为ARCFOX时,渠道类型中，包含space、race
            if(isArcfox()){
              this.dealerTypeRemove = ['25381006'];
            }else{
              this.dealerTypeRemove = ['25381004','25381005','25381006'];//2538
            }
            this.topFilterInit.find(x => x.fieldName === 'dealerType').itemList = this.createDictListRemoveCodes('2538',this.dealerTypeRemove);
      },
      //搜索数据
      topFilterInitFun(){
        return [
            {
              type: 'SELECT',
              label: '渠道类型',
              fieldName: 'dealerType',
              placeholder: '请选择',
              // initialValue: "",
              itemList:  []
            },
            {
              type: 'SELECT',
              label: '状态',
              fieldName: 'status',
              placeholder: '请选择',
              // initialValue: "",
              itemList:  this.createDictList('1003')
            },
            { type: 'RANGE_DATE',
              label: '创建日期',
              fieldName: 'createdAt',
              valueFormat: 'yyyy-MM-dd',
              // initialValue: [] ,
              placeholder: '请选择'
            },
            { type: 'INPUT',
              label: '项目代码',
              fieldName: 'constructionCode',
              // initialValue: '',
              placeholder: '请输入'
            },
            { type: 'INPUT',
              label: '项目名称',
              fieldName: 'constructionName',
              // initialValue: '',
              placeholder: '请输入'
            }
        ]
      },
      //搜索获取数据
      changeHandle(val){
        if (!val) {
          val = {createdAt:[]}
        }
        this.fetchParams = Object.assign({
          createdAtStart:val.createdAt[0]||undefined,
          createdAtEnd:val.createdAt[1]||undefined,
        }, val);
      },
      //table表头和数据源
      creatHeader(){
         return [
         {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
         },
         {
          title: '操作',
          dataIndex: 'column-action',
          width: 100,
          fixed: 'left',
          render: (props, h) => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.dialogHandle(props.row,'edit')}>
                  编辑
                </el-button>
              </div>
            );
          }
        },
        { title: '状态',  dataIndex: 'status', sorter: true,
            render: props => {    //编码转汉字
              return <span>{this.createDictText(props.row.status, '1003')}</span>;
            }
        },
        { title: '经销商类型',  dataIndex: 'dealerTypeStr', sorter: true,
            render: props => {    //编码转汉字
              let s = props.row.dealerTypeStr.split(',');
              let returnHtml = [];
              for(let sc in s){
                  returnHtml.push(this.createDictText(parseInt(s[sc]), '2538'));
              }
              return <span >{returnHtml.join(",")}</span>;
            }
        },
        { title: '项目代码',  dataIndex: 'constructionCode', sorter: true},
        { title: '项目名称',
          dataIndex: 'constructionName',
          showOverflowTooltip: true,
          sorter: true
        },
        { title: '创建人',   dataIndex: 'createdByName', sorter: true},
        // { title: '创建时间',    dataIndex: 'createdAt',  sorter: true,dateFormat:'YYYY-MM-DD hh:mm:ss'},
        { title: '创建时间',  dataIndex: 'createdAt',  sorter: true,
          render: props =>{
            return <span>{ formatdateByTime(props.row.createdAt) }</span>
          } },
        { title: '修改人',  dataIndex: 'updatedByName',   sorter: true},
        // { title: '修改时间',    dataIndex: 'updatedAt',  sorter: true,dateFormat:'YYYY-MM-DD hh:mm:ss'},
        { title: '修改时间',    dataIndex: 'updatedAt',  sorter: true,
          render: props =>{
            return <span>{ formatdateByTime(props.row.updatedAt) }</span>
          }
        },
        ]
      },
    //详情
    dialogHandle(row,type){
      this.visible = true;
      const pram = {
        type: type,
        rowData: row
      };
      this.initData=pram;
    },
    //关闭详情
    dialogClose(data){
      this.visible=false;
      if (data.type === 'refresh') {
        // 刷新列表数据
        this.fetchParams = { ...this.fetchParams };
      }
    },
     collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    }
  }
};
</script>

<style lang="less" scoped>
</style>
